<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>web interativa com ajax e PHP</title>
<script type="text/javascript">

/**
 * Verifica a compatibilidade do navevgador utilizado pelo usuario
 * 2015-02-01
 *
 * @autor Jannsen Brauer
 * 
 */
function IniciaAjax(){
    var ajax;
    if (window.XMLHttpRequest)
    {
        ajax = new XMLHttpRequest();
    }
    else if (window.ActiveXObject)
    {
        ajax =  new ActiveXObjetc("Msxm12.XMLHTTP");
        if (!ajax)
        {
            ajax = new ActiveXObect("Microsft.XMLHTTP");
        }
    }
    else
    {
        alert("Seu navegador não possui suporte a essa aplicação!");
    }
    return ajax;
}
/***
 * Função que processa os dados informados pelo usuario utilizando Ajax
 * 2015-02-01 
 * 
 * @autor Jannsen Brauer
 * 
 */
function Processa()
{
    ajax = IniciaAjax();
    if (ajax)
    {
        ajax.onreadystatechange = function(){
            if (ajax.readyState == 4)
            {
                if (ajax.status == 200)
                {
                    document.getElementById("resultado").value = ajax.responseText;
                }
                else
                {
                    alert(ajax.statusText);
                }
            }	
        }
        nome = document.getElementById("nome").value;
        valor = document.getElementById("valor").value;
        
        // monta a QueryString
        dados = 'nome='+nome+'&valor='+valor;
        
        // Faz a requisição e envio pelo método POSt
        ajax.open('POST', 'processa.php', true);
        ajax.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
        ajax.send(dados);
    }
}

function valida(){
	
}
</script>
</head>
<body>
<form name="form1" method="post" action="valida();">
    Nome: <input name="nome" type="text" id="nome" value="Jannsen"><br>
    Digite um valor: <input name="valor" type="text" id="valor" value=""><br>
    <button type="button" onclick="Processa();">Processar</button>
    <hr>Resultado: <input type="text" id="resultado" readonly="false" size="60">
</form>
</body>
</html>
























